.Reactions {
    position: relative;
    font-size: 11px;
    line-height: 18px;
    margin: 15px 0 0 0;
}

.React {
    position: relative;
    top: auto;
    right: auto;
}

.ReactButton {
    display: inline-block;
    margin: 0 5px;
    line-height: 18px;
    vertical-align: top;
    position: relative;
}

.UserReactionWrap {
    position: relative;
    line-height: 1;
    display: inline-block;
    margin-right: 3px;
}

.UserReactionWrap .ReactSprite {
    position: absolute;
    right: -2px;
    bottom: -2px;
    background-image: url('images/action-sprites-bordered.png');
}

.Item:hover .Reactions a {
    width: inherit;
}

.DataCounts {
    margin: 5px 0;
    text-align: center;
}

.CountTotal {
    display: block;
    line-height: 100%;
    font-size: 28px;
}

.CountItemWrap {
    width: auto;
    display: inline-block;
}

.CountItem {
    display: block;
    text-align: center;
    border: solid 2px transparent;
    padding: 4px;
    margin: 0 4px;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    white-space: nowrap;
    overflow: visible;
}

.CountItem.Selected {
    background: rgba(55, 173, 227, 0.1);
    border: solid 2px rgba(55, 173, 227, .2);
    padding: 4px
}

.RecordReactions {
    margin-top: 15px;
}
.RecordReactions + .Reactions {
    margin-top: 0;
}

.Reactions .Count {
    font-size: 8px;
    background: #555;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    margin-right: 4px;
    vertical-align: top;
}
.Item .Reactions > * {
    visibility: hidden;
}
.Item .Reactions > *.Visible {
    visibility: visible;
}
.Item.Open .Reactions > *,
.Item:hover .Reactions > *,
.Item .Reactions > .FlagMenu {
    visibility: visible;
}

.Reactions > a.React > .ReactSprite {
    margin-right: 2px;
}

/* iPad/iPhone */
@media only screen and (device-width: 768px),
only screen and (max-device-width: 480px) {
    .Item .Reactions > * { visibility: visible; }
}

/* Override default reactsprite styles from style.css to work with custom sheets */
.ReactSprite {
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-right: 4px;
    line-height: 18px;
    vertical-align: bottom;
    background-image: url('images/action-sprites.png')!important;
    background-position: 16px 16px;
    background-repeat: no-repeat;
}
.ReactButton.Quote .ReactSprite.ReactQuote {
    background-image: none!important;
}
input + .ReactSprite {
    vertical-align: middle;
}

.ReactHappy { background-position: -4px -4px; }
.ReactHappy2 { background-position: -28px -4px; }
.ReactSmiley { background-position: -52px -4px; }
.ReactSmiley2 {	background-position: -76px -4px; }
.ReactTongue { background-position: -100px -4px; }
.ReactTongue2 {	background-position: -124px -4px; }
.ReactSad {	background-position: -148px -4px; }
.ReactSad2 { background-position: -172px -4px; }
.ReactWink { background-position: -196px -5px; }
.ReactWink2 { background-position: -220px -4px; }
.ReactGrin { background-position: -244px -4px; }
.ReactShocked { background-position: -268px -4px; }
.ReactConfused { background-position: -292px -4px; }
.ReactConfused2 { background-position: -316px -4px; }
.ReactNeutral { background-position: -340px -4px; }
.ReactNeutral2 { background-position: -364px -4px; }
.ReactWondering { background-position: -4px -28px; }
.ReactWondering2 { background-position: -28px -28px; }
.ReactPointUp { background-position: -52px -28px; }
.ReactPointRight { background-position: -76px -28px; }
.ReactPointDown { background-position: -100px -28px; }
.ReactPointLeft { background-position: -124px -28px; }
.ReactThumbsUp { background-position: -148px -28px; }
.ReactThumbsUp2 { background-position: -172px -28px; }
.ReactShocked2 { background-position: -196px -28px; }
.ReactEvil { background-position: -220px -28px; }
.ReactEvil2 { background-position: -244px -28px; }
.ReactAngry { background-position: -268px -28px; }
.ReactAngry2 { background-position: -292px -28px; }
.ReactHeart { background-position: -316px -28px; }
.ReactHeart2 { background-position: -340px -28px; }
.ReactHeartBroken { background-position: -364px -28px; }
.ReactStar { background-position: -4px -52px; }
.ReactStar2 { background-position: -28px -52px; }
.ReactGrin2 { background-position: -52px -52px; }
.ReactCool { background-position: -76px -52px; }
.ReactCool2 { background-position: -100px -52px; }
.ReactQuestion { background-position: -124px -52px; }
.ReactNotification { background-position: -148px -52px; }
.ReactWarning { background-position: -172px -52px; }
.ReactSpam { background-position: -196px -52px; }
.ReactBlocked { background-position: -220px -52px; }
.ReactEye { background-position: -244px -52px; }
.ReactEye2 { background-position: -268px -52px; }
.ReactEyeBlocked { background-position: -292px -52px; }
.ReactFlag { background-position: -316px -52px; }
.ReactBrightnessMedium { background-position: -340px -52px; }
.ReactQuotesLeft, .ReactQuote { background-position: -364px -52px; }
.ReactMusic { background-position: -4px -76px; }
.ReactPacman { background-position: -28px -76px; }
.ReactBullhorn { background-position: -52px -76px; }
.ReactRocket { background-position: -76px -76px; }
.ReactFire { background-position: -100px -76px; }
.ReactHammer { background-position: -124px -76px; }
.ReactTarget { background-position: -148px -76px; }
.ReactLightning { background-position: -172px -76px; }
.ReactShield { background-position: -196px -76px; }
.ReactCheckmarkCircle { background-position: -220px -76px; }
.ReactLab { background-position: -244px -76px; }
.ReactLeaf { background-position: -268px -76px; }
.ReactDashboard { background-position: -292px -76px; }
.ReactDroplet { background-position: -316px -76px; }
.ReactFeed { background-position: -340px -76px; }
.ReactSupport { background-position: -364px -76px; }
.ReactHammer2 { background-position: -4px -100px; }
.ReactWand { background-position: -28px -100px; }
.ReactCog { background-position: -52px -100px; }
.ReactGift { background-position: -76px -100px; }
.ReactTrophy { background-position: -100px -100px; }
.ReactMagnet { background-position: -124px -100px; }
.ReactSwitch { background-position: -148px -100px; }
.ReactGlobe { background-position: -172px -100px; }
.ReactBookmark { background-position: -196px -100px; }
.ReactBookmarks { background-position: -220px -100px; }
.ReactStar3 { background-position: -244px -100px; }
.ReactInfo { background-position: -268px -100px; }
.ReactInfo2 { background-position: -292px -100px; }
.ReactCancelCircle { background-position: -316px -100px; }
.ReactCheckmark { background-position: -340px -100px; }
.ReactClose { background-position: -364px -100px; }

/* Share icons need to be specified here to undo the override */
.ReactFacebook { background-position: -29px -124px; }
.ReactTwitter { background-position: -53px -124px; }
.ReactGooglePlus { background-position: -77px -124px; }

.ReactSprite.ReactFacebook, .ReactSprite.ReactTwitter, .ReactSprite.ReactGooglePlus {
    background-image: url('../../dashboard/design/images/sprites-14-000000.png');
}


.MenuItems a:hover .ReactSprite {
    background-image: url('images/action-sprites-white.png');
}

#Content .BoxFilter.BoxBestFilter {
    display: block;
}

/* Missing sprite background offsets */
.Sprite.SpBestOf {
    background-position: -246px -5px;
}

.Sprite.SpBadge {
    background-position: -245px -52px;
}
